<template>
  <a-modal v-model="visible" title="通道设置" @ok="handleOk" :width="width">
    <a-row>
      <a-row>
        <a-col span=8 v-for="i in 3" v-bind:key="i">
          <span style="margin-left: 40px; font-weight: 600;">名字</span>
          <span style="margin-left: 132px; font-weight: 600;">控制电流</span>
          <span style="margin-left: 40px; font-weight: 600;">通道开关</span>
        </a-col>
      </a-row>
      <a-col span=8 v-for="(item, index) in myDevice.switches.switches" v-bind:key="index"
        style="padding:4px 5px 4px 10px; border:1px solid gray;height:45px;line-height:40px;">
        <a-row>
          <a-col span=1>
            {{ index + 1 }}
          </a-col>
          <a-col span=10 style="padding-left:2px;">
            <a-input v-model="item.name" placeholder="通道名称（限18字）"/>
          </a-col>
          <a-col span=4 style="padding-left:8px;">
            <a-input v-model="item.controlC" @change="onEditChange(item, index)">A</a-input>
          </a-col>
          <a-col span=9 style="padding-left:15px;line-height:45px;">
            <a-radio-group v-model="item.state">
              <a-row>
                <a-col span=12><a-radio :value="0">开</a-radio></a-col>
                <a-col span=12><a-radio :value="1">关</a-radio></a-col>
              </a-row>
            </a-radio-group>
          </a-col>
        </a-row>
      </a-col>
    </a-row>


    <template slot="footer">
      <a-button type="primary" @click="handleSetDefaultValue">恢复默认设置</a-button>
      <a-divider type="vertical" />
      <a-button type="primary" @click="handleEditChannelName">修改名称</a-button>
      <a-divider type="vertical" />
      <a-button type="primary" @click="handleEditCurrentLimit">修改电流</a-button>
      <a-divider type="vertical" />
      <a-button type="primary" @click="handleSwitchChange">修改通道开关</a-button>
      <a-button key="back" @click="handleBack">关闭</a-button>
    </template>
  </a-modal>
</template>

<script>
import { setDevice } from '@/api/deviceApi'

export default {
  name: 'TigDeviceChannelSettingModal',
  components: {

  },
  props: {

  },
  data() {
    return {
      visible: false,
      width: '1280px',
      myDevice: {
        baseinfo: {},
        network: {},
        warning: {},
        switches: {
          total: 0,
          switches: []
        }
      },
    }
  },
  computed: {

  },
  methods: {
    handleSetDefaultValue() {
      let that = this
      this.$confirm({
        title: '确认恢复',
        content: '是否恢复电源开关(开) 和控制电流(5A)的默认值?',
        onOk: function () {
          //v-for="(item, index) in myDevice.switches.switches"
          that.myDevice.switches.switches.forEach(item => {
            item.state = 0;
            item.controlC = 5;
          });
        }
      })
    },

    handleEditCurrentLimit() {
      var that = this
      //console.log(this.myDevice.switches)
      if (!this.checkSwitchCurrentLimit())
        return
      setDevice({ cmd: 'setDeviceChannelCurrent', data: this.myDevice }).then(res => {
        that.$message.info("设置已发送")
        //that.hide()
      })
    },
    handleSwitchChange() {
      var that = this
      //console.log(this.myDevice.switches)
      setDevice({ cmd: 'setDeviceChannelSwitch', data: this.myDevice }).then(res => {
        that.$message.info("设置已发送")
        //that.hide()
      })
    },
    handleEditChannelName() {
      var that = this
      setDevice({ cmd: 'setDeviceLocalData', data: this.myDevice }).then(res => {
        that.$message.info("设置已发送")
        //that.hide()
      })
    },
    handleOk() {
      this.visible = false
    },
    handleBack() {
      this.hide();
    },
    isChecked(state) {
      if (state == 0)
        return true
      else
        return false
    },
    show() {
      this.visible = true
    },
    edit(device) {
      this.myDevice = JSON.parse(JSON.stringify(device));
      let i = 1;
      this.myDevice.switches.switches.forEach(item => {
        if (item.name == undefined || item.name == "")
          item.name = "通道" + i;
        if(item.controlC != undefined && item.controlC != "")
          item.controlC = item.controlC * 10 / 10;
        i++;
      });
      this.show()
    },
    hide() {
      this.visible = false
    },
    toggleSwitch(item, index) {
      if (item.state == 0)
        item.state = 1
      else
        item.state = 0
    },
    onEditchange(item, index) {
      console.log(item)
    },
    checkSwitchCurrentLimit() {
      for (let item of this.myDevice.switches.switches) {
        if (item.controlC < 0 || item.controlC > 5) {
          this.$message.warning(item.name + "控制电流值设置超过指定范围！")
          return false
        }
      }
      return true;
    }

  },
  watch: {

  },
}
</script>